<template>
	<view>
		<view class="cu-bar bg-white">
			<view class="action" @tap="$wanlshop.back(1)">
				<text class="cuIcon-back text-gray"></text> 返回
			</view>
			<view class="content text-bold">
				{{JSON.stringify(propsObj) == "{}"? bar_title : propsObj.item}}
			</view>
		</view>
		<view class="content"  :style="{'height':content_height+'px'}">
			<view class="success_img">
			</view>
			<view class="success_title">{{JSON.stringify(propsObj) == "{}"? '支付' : propsObj.title}}成功</view>
			<view class="success_desc">您已成功{{JSON.stringify(propsObj) == "{}"? '支付' : propsObj.title}}</view>
			<view class="success_desc">工匠会尽快开始为您施工，请耐心等待！</view>
			<view class="success_btn">
				<button class="cu-btn" @tap="$wanlshop.to('/pages/user/reservation/reservation')">查看预约</button>
				<button class="cu-btn toIndex" @click="toIndex"  @tap="goIndex">返回首页</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "call-success",
		props: {
			bar_title: '',
		},
		data() {
			return {
               content_height:0,
			   propsObj:{}
			};
		},
		onLoad(options) {
			if(JSON.stringify(options) != '{}'){
				this.propsObj = options
			}
			console.log(options)
		},
		created(){
			var that=this
			uni.getSystemInfo({
				success(res) {
					that.content_height=(res.windowHeight)-65;
				}
			})
		},
		methods:{
			toIndex(){
				uni.setTabBarStyle({
					backgroundColor: '#ffffff',
					borderStyle: 'white'
				});
				uni.switchTab({
					url: '/pages/index'
				});
			},
			goIndex(){
				uni.reLaunch({
					url:"/pages/tabbarcompotant/index/landlord"
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		background-color: #FFFFFF;
	}
	.success_img {
		background-image: url("https://img.aibbyp.com/wechat/images/call/success/pay.png");
		height: 300upx;
		width: 300upx;
		margin: 10% auto;
		background-repeat: no-repeat;
		background-position: 0%;
		background-size: 100%;
	}
	.success_title {
		margin: -12% auto;
		
		font-family: Source Han Sans;
		font-size: 20px;
		font-weight: 500;
		line-height: normal;
		letter-spacing: 0em;
		font-feature-settings: "kern" on;
		color: #333333;
		margin-bottom: 35upx;
	}
	.success_desc{
		margin:0 auto;
		font-family: Source Han Sans;
		font-size: 14px;
		font-weight: normal;
		line-height: 28px;
		text-align: center;
		letter-spacing: 0em;
		
		font-feature-settings: "kern" on;
		color: #666666;
	}
	.success_btn {
		display: flex;
		flex-direction: row;
		width: 80%;
		margin: 70upx auto;
	}
	.cu-btn {
		border: 1px solid #CCCCCC;
		width: 320upx;
		height: 80upx;
		color: #666666;
		background-color: #FFFFFF;
	}
	.toIndex {
		margin-left: 5%;
		background-color: #FF4530;
		font-feature-settings: "kern" on;
		color: #FFFFFF;
	}
</style>